{% extends 'base.html' %}
{% load static %}
{% block title %}Voluntários COVID-19 - {{ block.super }}{% endblock %}
{% block content %}
<div class="section">
  <h4>Voluntários COVID-19</h4>
  <div class="divider"></div>

  <div class="row text-center">
    <p>
      A base de dados de casos e óbitos da COVID-19 é possível graças ao
      trabalho árduo de dezenas de pessoas que, diariamente, compilam os
      boletins epidemiológicos das 27 Secretarias Estaduais de Saúde,
      manualmente. Veja quem são, <i>em ordem aleatória</i>:
    </p>
  </div>

  <div class="row text-center">
    <h5>Atuais</h5>
    {% for volunteer in volunteers %}
    {% if volunteer.active %}
    <div class="col s12 m3" style="height: 12rem">
      <span class="fa-stack fa-4x text-center">
        <a href="{{ volunteer.personal_url }}" target="_blank" title="Visitar perfil de {{ volunteer.name }}">
          <img class="circle responsive-img" src="{{ volunteer.avatar_url }}" alt="Imagem de {{ volunteer.name }}">
        </a>
      </span>
      <h6> <a href="{{  volunteer.personal_url }}" title="Visitar perfil de {{ volunteer.name }}">{{ volunteer.name }}</a> </h6>
    </div>
    {% endif %}
    {% endfor %}
  </div>

  <div class="row text-center">
    <h5>Ex-voluntárias(os)</h5>
    {% for volunteer in volunteers %}
    {% if not volunteer.active %}
    <div class="col s12 m3" style="height: 12rem">
      <span class="fa-stack fa-4x text-center">
        <a href="{{ volunteer.personal_url }}" target="_blank" title="Visitar perfil de {{ volunteer.name }}">
          <img class="circle responsive-img" src="{{ volunteer.avatar_url }}" alt="Imagem de {{ volunteer.name }}">
        </a>
      </span>
      <h6> <a href="{{  volunteer.personal_url }}" title="Visitar perfil de {{ volunteer.name }}">{{ volunteer.name }}</a> </h6>
    </div>
    {% endif %}
    {% endfor %}
  </div>

  <div class="row text-center">
    <p>
      Além das pessoas que contribuem na coleta de dados, veja também as que <a
        href="https://apoia.se/brasilio" title="Apoie o Brasil.IO"><b>contribuem financeiramente</b></a>
      e as que <a href="{% url 'core:contributors' %}" title="Nossos contribuidores"><b>contribuem com
          código</b></a>. Diversas outras pessoas também colaboram com
      <b>informações, sugestões, correções e na divulgação dos dados</b>.
    </p>
  </div>

</div>
{% endblock %}
